import { Button, Col, Row, Select } from 'antd';
import moment from 'moment';
import React from 'react';

// 集团审批版页面操作区域
export default props => {
  const {
    versionList,
    onChangeVersion,
    currentVersion,
    versionLoading,
    onClickCoreIndicators,
    coreIndicatorsDisabled,
  } = props;
  return (
    <Row type="flex" align="middle" justify="space-between">
      <Col>
        <Select
          size="small"
          style={{ minWidth: '200px' }}
          onSelect={onChangeVersion}
          value={currentVersion?.versionId}
          loading={versionLoading}
        >
          {versionList.map(item => (
            <Select.Option value={item.versionId} key={item.versionId}>
              {item.versionName}
              {item.versionNum}-{moment(item.updateTime).format('YYYYMMDD')}
            </Select.Option>
          ))}
        </Select>
        &nbsp;&nbsp;
        {currentVersion?.source ? (
          <span>
            <i className="dots" style={{ background: 'rgba(39, 97, 255, 1)' }} />
            {`发起系统-${currentVersion?.source || '-'}`}
          </span>
        ) : null}
      </Col>
      <Col>
        <Button size="small" onClick={onClickCoreIndicators} disabled={coreIndicatorsDisabled}>
          核心指标
        </Button>
      </Col>
    </Row>
  );
};
